<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
<title>帮淘 - 画报</title>
<link href="../../css/v4/common/base.css" type="text/css" rel="stylesheet" />
<link href="../../css/v4/common/hf.css" type="text/css" rel="stylesheet" />
<link href="../../css/v4/detail.css" type="text/css" rel="stylesheet" />
<link  type="text/css" rel="stylesheet" href="/css/v4/lr.css"/>
<%@include file="../common/js.jsp"%>
<!--[if ie 6]><script src="/js/v3/iepng.js" type="text/javascript"></script><![endif]-->
<!--[if ie]><link href="../../css/v4/common/IE.css" type="text/css" rel="stylesheet"><![endif]-->
</head>

<body>
	<!-- head -->
	<%@include file="../common/header.jsp"%>
	<!-- head--end-->

	<!-- body -->

	<div class="w100p pt20 pb35">
		<div class="w980 mg hb_show">

			<!-- huabao-title -->
			<div class="nav_tit_top">
				<div class="nav_s1">
					<a href="amoys.htm">妈妈帮淘</a>&nbsp;/&nbsp;<a href="discuss.htm?id=${ccid}">${discuss.title}</a>&nbsp;/&nbsp;
					<a href="#">画报列表</a>
				</div>
			</div>
			<!-- huabao-title--end-->
			<div class="hb_items_show clearfix">
				<c:choose>
					<c:when
						test="${pictorialModel.totalRecord<=0 || empty pictorialModel}">
						<c:forEach begin="0" end="2">
							<div class="item_box" style="width: 228px; height: 100px;"></div>
						</c:forEach>
						<div class="item_box box_s1">
							<div class="shadow"></div>
							<div class="hb_pd_s3">
								<div class="hb_slider">
									<h3 class="title">话题</h3>
									<p class="info">${discuss.title }</p>
									<c:if test="${onlineUser.member==null }">
										<a href="javascript:void(0);" class="def_btn_s10"
											onclick="GUOGUO.memberLogin();">上传图片</a>
									</c:if>
									<c:if test="${onlineUser.member!=null }">
										<a href="javascript:void(0);" class="def_btn_s10" onclick="imgUpload();">上传图片</a>
									</c:if>
									<dl class="com_dl join_zt">
										<dt>正在参与的人</dt>
										<c:forEach items="${listName}" var="name">
											 <dd class="lay_lr_box">
			                                	<a href="/member/tashare.htm?ta=${name.member }" class="l_box"><img src="${name.imageServer}${name.avatar}" class="block"  width="28px;"height="28px;"/></a>
			                                    <div class="r_box clearfix">
			                                    	<a href="/member/tashare.htm?ta=${name.member }" class="name">${name.nickname}</a>
			                                    </div>
	                               			 </dd>
                               			</c:forEach>
									</dl>
								</div>
							</div>
						</div>
					</c:when>


					<c:when
						test="${pictorialModel.totalRecord>0 && pictorialModel.totalRecord<4 }">
						<c:forEach items="${pictorialModel.list}" var="plist" varStatus="pnum">
							
							<c:if test="${fn:length(plist.doingList)>2}">
								<div class="item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3" onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="pic block"> 
											<img src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[0].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
										<div class="hb_three_box">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
											<img src="${plist.doingList[1].doingObj.doingPictureList[0].picUrl}_100x100.jpg" width="100" height="100" class="block" alt="${plist.pictorialObj.title}"/> </a> 
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
											<img src="${plist.doingList[2].doingObj.doingPictureList[0].picUrl}_100x100.jpg" width="100" height="100" class="block" alt="${plist.pictorialObj.title}"/> </a>
										</div>
									</div>
									<div class="hb_pro_t">
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }"><img src="${plist.imageServer}${plist.avatar}" class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
						
							<c:if test="${fn:length(plist.doingList)==2}">
								<div class=" item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3" onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="pic block">
											<img src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[0].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
										<div class="hb_two_box">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
											<img src="${plist.doingList[1].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[1].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[1].doingObj.doingPictureList[0].height200xxx}" class="block" alt="${plist.pictorialObj.title}"/> </a>
										</div>
									</div>
									<div class="hb_pro_t">
										<a
											href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}"
											class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }"><img src="${plist.imageServer}${plist.avatar}" class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
							<c:if test="${fn:length(plist.doingList)==1}">
								<div class="item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3" onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="pic block">
											<img src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg"  width="${plist.doingList[1].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[1].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
									</div>
									<div class="hb_pro_t">
										<a
											href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}"
											class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }"><img
														src="${plist.imageServer}${plist.avatar}"
														class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
						</c:forEach>
						<c:if test="${pictorialModel.totalRecord < 4 }">
							<c:forEach begin="0" end="${3-pictorialModel.totalRecord}">
								<div class="item_box" style="width: 228px; height: 100px;"></div>
							</c:forEach>
							<div class="item_box box_s1">
								<div class="shadow"></div>
								<div class="hb_pd_s3">
									<div class="hb_slider">
										<h3 class="title">话题</h3>
										<p class="info">${discuss.title }</p>
										<c:if test="${onlineUser.member==null }">
											<a href="javascript:void(0);" class="def_btn_s10"
												onclick="GUOGUO.memberLogin();">上传图片</a>
										</c:if>
										<c:if test="${onlineUser.member!=null }">
											<a href="javascript:void(0);" class="def_btn_s10" onclick="imgUpload();">上传图片</a>
										</c:if>
										<dl class="com_dl join_zt">
											<dt>正在参与的人</dt>
											<c:forEach items="${listName}" var="name">
											 <dd class="lay_lr_box">
			                                	<a href="/member/tashare.htm?ta=${name.member }" class="l_box"><img src="${name.imageServer}${name.avatar}" class="block"  width="28px;"height="28px;"/></a>
			                                    <div class="r_box clearfix">
			                                    	<a href="/member/tashare.htm?ta=${name.member }" class="name">${name.nickname}</a>
			                                    </div>
	                               			 </dd>
                               			</c:forEach>
										</dl>
									</div>
								</div>
							</div>
						</c:if>
					</c:when>
					<c:otherwise>
						<c:forEach items="${pictorialModel.list}" var="plist"
							varStatus="pnum">
							
							<c:if test="${fn:length(plist.doingList)>2}">
								<div class="item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3"  onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="pic block"> 
										    <img src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[0].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
										<div class="hb_three_box">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
												<img src="${plist.doingList[1].doingObj.doingPictureList[0].picUrl}_100x100.jpg" width="100" height="100" class="block" alt="${plist.pictorialObj.title}"/> </a>
											 <a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
												 <img src="${plist.doingList[2].doingObj.doingPictureList[0].picUrl}_100x100.jpg" width="100" height="100" class="block" alt="${plist.pictorialObj.title}"/> </a>
										</div>
									</div>
									<div class="hb_pro_t">
										<a
											href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}"
											class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }"><img
														src="${plist.imageServer}${plist.avatar}"
														class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
							<c:if test="${fn:length(plist.doingList)==2}">
								<div class=" item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3" onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="pic block">
											<img src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[0].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
										<div class="hb_two_box">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="fl">
												<img src="${plist.doingList[1].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg" width="${plist.doingList[1].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class="block" alt="${plist.pictorialObj.title}"/> </a>
										</div>
									</div>
									<div class="hb_pro_t">
										<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">
														<img src="${plist.imageServer}${plist.avatar}" class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
							<c:if test="${fn:length(plist.doingList)==1}">
								<div class="item_box box_s1">
									<div class="shadow"></div>
									<div class="pro_box hb_pic_3" onmouseover="$(this).find('.love_comment_ope').show()" onmouseout="$(this).find('.love_comment_ope').hide()">
										<div class="love_comment_ope" style="display: none;">
											<a href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}" class="icon_bg comment">评论</a>
										</div>
										<a
											href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}"
											class="pic block"><img
											src="${plist.doingList[0].doingObj.doingPictureList[0].picUrl}_200xXXX.jpg"
											width="${plist.doingList[0].doingObj.doingPictureList[0].width200xxx}" height="${plist.doingList[0].doingObj.doingPictureList[0].height200xxx}" class=" block" alt="${plist.pictorialObj.title}"/> </a>
									</div>
									<div class="hb_pro_t">
										<a
											href="/picdoingshow.htm?plid=${plist.pictorialObj.identifier}"
											class="title">${plist.pictorialObj.title}</a>
									</div>
									<div class="hb_pro_info">
										<ul class="lay_lr_box">
											<li>
												<div class="l_box">
													<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }"><img
														src="${plist.imageServer}${plist.avatar}"
														class=" avater block" width="28px;" height="28px;" /> </a>
												</div>
												<div class="r_box">
													<p class="name">
														<a href="/member/tashare.htm?ta=${plist.pictorialObj.member }">${plist.nickname}</a>
													</p>
													<div class="hb_rel_nums">
														<span>围观(<i>${plist.pictorialObj.viewAmount }</i>)</span>
														<span>评论(<i>${plist.pictorialObj.commentAmount}</i>)</span>
													</div>
												</div></li>
										</ul>
									</div>
								</div>
							</c:if>
							
							<c:if test="${pnum.index==2}">
								<div class="item_box box_s1">
									<div class="shadow"></div>
									<div class="hb_pd_s3">
										<div class="hb_slider">
											<h3 class="title">话题</h3>
											<p class="info">${discuss.title }</p>
											<c:if test="${onlineUser.member==null }">
												<a href="javascript:void(0);" class="def_btn_s10" onclick="GUOGUO.memberLogin();">上传图片</a>
											</c:if>
											<c:if test="${onlineUser.member!=null }">
												<a href="javascript:void(0);" class="def_btn_s10" onclick="imgUpload();">上传图片</a>
											</c:if>
											<dl class="com_dl join_zt">
												<dt>正在参与的人</dt>
												<c:forEach items="${listName}" var="name">
											 <dd class="lay_lr_box">
			                                	<a href="/member/tashare.htm?ta=${name.member }" class="l_box"><img src="${name.imageServer}${name.avatar}" class="block" width="28px;"height="28px;"/></a>
			                                    <div class="r_box clearfix">
			                                    	<a href="/member/tashare.htm?ta=${name.member }" class="name">${name.nickname}</a>
			                                    </div>
	                               			 </dd>
                               			</c:forEach>
											</dl>
										</div>
									</div>
								</div>
							</c:if>
							
						</c:forEach>
					</c:otherwise>
				</c:choose>
			</div>
		</div>
	</div>

	<!-- body--end-->

	<!-- fanye -->
			<div class="fanye mt50" id="pager"></div>
	<!-- fanye--end-->

	<script type="text/javascript">
		$(function() {
			$("div.hb_items_show").masonry({
				itemSelector : '.item_box',
				columnWidth : 244,
				isAnimated : false
			});
		});

		function imgUpload() {
			var size = $("#lb_pic").size();
			if (size < 1) {
				$("body")
						.append(
								'<div class="release_box up_load_box tc_box" id="lb_pic"></div>');
			}
			$("#lb_pic").load("imgUploadPicDoing.htm?theme=${theme}&did=${ccid}",
					function() {
						$.fn.popDiv({
							tcID : "lb_pic",
							isZZ : true,
							speed : 200,
							noResize : false
						});
					});

		}
		$(function(){
			$("#pager").pager({
				pagenumber : "${pictorialModel.currentPage}",
				pagecount : "${pictorialModel.totalPage}",
				buttonClickCallback : function(page) {
					location.href = "/piclshow.htm?discussId=${ccid}&page="+ page;
				}
			});
		});
	</script>
</body>
</html>
